    .icon {
        width: 1em;
        height: 1em;
        vertical-align: -0.15em;
        fill: currentColor;
        overflow: hidden;
    }
    .icon {
        width: 1em;
        height: 35px;
        vertical-align: -0.15em;
        fill: currentColor;
    }
    ul{
        list-style: none;
    }
    a{
        text-decoration: none;
        color: rgb(255, 255, 255);
    }
    /* 固定导航一起用 否则导航不出来 必须设置 */
    body{
        margin-bottom: 50px;
    }
    header>div{
        display: flex;
    }
    .reg{
        font-size: 10px;
        width: 60px;
        height: 30px;
        line-height: 30px;
        margin-left: 5px;
        margin-right: 5px;
    }
    .reg a{
        color: #fff;
    }
    main{
        width: 375px;
        margin: 3px auto 1px auto;
        overflow: hidden;
    }
    .btnSearch{
        height: 20px;
        line-height: 20px;
        background-color: rgb(0, 0, 0);
        font-size: 15px;
        color: #fff;
        padding: 0 5px;
        border-radius: 0 10px 10px 0;
        box-sizing: border-box;
        letter-spacing: 1px;
        display: inline-block;
        cursor: pointer;/* 鼠标样式变为手 */
    }
    .searchBox{/* 搜索大盒子 */
        margin-left: 20px;/* 搜索部分与logo的距离 */
        margin-right: 1px;/* 搜索部分与注册的距离 */
        margin-top: 2px;/* 搜索部分与网页顶部距离 */
    }
    .keyword{/* 搜索框 */
        height: 30px;
        width: 200px;
        background-color: rgb(0, 0, 0);
        font-size: 10px;
        padding-left: 2px;
        border-radius: 2px 0 0 2px;
        box-sizing: border-box;
    }
    input{
        color: #fff;
    }
    .fleft{
        flex-direction: row;
    }
    .tab-title a:link,.tab-title a:visited{
        /* 超链接原始效果和点击后的 黑底白字 */
        display: inline-block;
        flex-direction: row;
        justify-content: flex-start;
        width: 60px;
        height: 30px;
        line-height: 30px;
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        background-color: #000;
        margin-left: 2px;
    }
    .tab-title a.second,.tab-title a:hover,.tab-title a:active{
        background-color: #000;
        color: rgb(234, 129, 146)
    }
    .tab-title{
        display: flex;
        justify-content: flex-start;
        height: 60px;
        background-color: #000;
    }
    .mid{
        display: flex;
        justify-content: space-between;
        height: 70px;
        margin-bottom: 30px;
    }
    .mid a{
        display: inline-block;
    }
    .mid img{
        width: 50px;
        height: 50px;
        margin: 10px;
    }
    .mid p{
        color: #fff;
        text-align: center;
    }
    .remenhuati{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 10px;
    }
    .remenhuati p{
        font-weight: bold;
        color: #fff;
    }
    .remenhuati a{
        display: flex;
        color: #4d4d4d;
        align-items: center;
        margin-right: 3px;
    }
    .neirong{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .neirong p{
        font-size: 12px;
        color: #fff;
        margin-left: 22px;
    }
    .neirong div{
        width: 49%;
    }
    img{
        display: block;
        border: none;
    }
    .video{
        width: 350px;
        margin-left: 3px;
        border-bottom: 3px dashed #858585;
        margin-bottom: 4px; 
        padding-bottom: 4px;
    }
    .video img{
        display: inline-block;
        width: 120px;
    }
    .text{
        display: inline-block; 
        width: 180px;
        padding-left: 8px;
        position: relative;
        margin-top: 10px;
    }
    .text h3{
        line-height: 33px; 
        font-size: 13px; 
        color: #fff;
        margin-bottom: 30px;
        text-overflow: ellipsis;/* 1 */
        overflow: hidden;/* 2 */
        white-space: nowrap;/* 3 */
    }
    .text span{
        line-height: 22px; 
        font-size: 14px; 
        color: #888;
    }
    .author{
        margin-left: 3px;
    }
    .playcount{
        position: absolute;
        right: 10px;
        bottom: 0;
    }
    /* 固定导航一起用 否则导航不出来 必须设置 */
    body{
        margin-bottom: 50px;
    }
    .bnav{
        position: fixed;
        bottom: 0;
        left: 0;
        background-color: #000;
        width: 100%;
        z-index: 9;
    }
    .bnav>ul{
        display: flex;
    }
    .bnav li{/* 自适应宽度 5个li 100%/5=20% */
        width: 20%;
        text-align: center;
    }
    .bnav p{
        color: #fff;
        font-size: 10px;
        line-height: 26px;
        letter-spacing: 3px;
    }
    .bnav li:nth-child(1):hover p {
        color: rgb(234, 129, 146);
    }
    .bnav li:nth-child(2):hover p {
        color: rgb(234, 129, 146);
    }
    .bnav li:nth-child(4):hover p {
        color: rgb(234, 129, 146);
    }     
    .bnav li:nth-child(5):hover p {
        color: rgb(234, 129, 146);
    }